<template>
	<div>
		<van-dialog v-model="show" :showConfirmButton="false" :title="confirmTitle">
            <div class="a">
            	<div class="title">{{title}}</div>
            </div>
            <div class="subTitle" v-if="showSubTitle">{{subTitle}}</div>
            <div class="b">
            	<div class="c" @click="cancel">{{cancelBtn}}</div>
            	<div class="c active" @click="query">{{queryBtn}}</div>
            </div>
		</van-dialog>  		
	</div>
</template>

<script>
export default {
	props:{
	  title:{
	  	type:String,
	  	default: ''
	  },
	  queryBtn:{
	  	type:String,
	  	default: '确认'
	  },
	  cancelBtn:{
	  	type:String,
	  	default: '取消'
	  },	  
	  confirmTitle:{
	  	type:String,
	  	default: ''	  	
	  },
	  subTitle:{
	  	type:String,
	  	default: ''	 	  	
	  },
	  showSubTitle:{
	  	type:Boolean,
	  	default: true	 	  	
	  }
	},
	data() {
       return { 
          show:false
       }
	},	
	methods: {
		showWin(){
			this.show=true
		},
		cancel(){
		    this.show=false
		},
		query(){
			this.$emit('queryConfirm')
			this.show=false
		}
	},
	mounted() {
		
	}
}
</script>

<style scoped="">
.a{padding:20px;text-align: center;font-size: 12px;font-weight: 500;color: #999;line-height: 24px;display: flex;justify-content: center;}
.title{color: #333;font-size: 14px;width: 100%;}
.b{display: flex;border-top: 1px solid #e5e5e5;}
.c{flex: 1;text-align: center;padding: 15px 0;}
.c.active{background: #FFD630;}
.subTitle{padding:0 20px 20px;text-align: center;}
</style>